<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/general.css"/>
		<link rel="stylesheet" type="text/css" href="../css/lcs-font.css"/>
		<style type="text/css">
			*{
				font-size: 0.9em;
			}
		.mui-bar-nav {
		    top: 0;
		    -webkit-box-shadow: 0 0px 0px #ccc;
		    box-shadow: 0 0px 0px #ccc;
		}
.show1{
				width: 100%;
				padding: 0.3em;
				background-color: white;
				font-size: 1.3em;
			}
			.show2{
				background-color: white;
				width: 98%;
				margin: auto;
				padding: 0.1em;
				border-radius:20px ;
			}
			.show3{
				width: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
			}
			.sdiv{
				display: flex;
				justify-content: flex-start;
				align-items: center;
				padding: 0em 2em;
				margin: 0;
			}
			
			.text5{
				width: 33%;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
			}
			.br{
				border-right:1px solid #C0C0C0 ;
			}
			.div8{
				width: 100%;
				display: flex;
				justify-content: flex-start;
				align-items: flex-start;
				flex-wrap: wrap;
			}
			.div8>div{
				width: 25%;
				padding: 0.3em;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				background-color: white;
			}
			.div8>div>div{
				white-space: nowrap;
				font-size: 1.1em;
			}
			.xgd{
				width: 100%;
				height: 5px;
				background-color: #EBF4FF;
			}
			.mainimg{
				width: 30px;
				height: 30px;
				margin: 0.4em;
			}
			.mainimg>img{
				width: 100%;
				height: 100%;
			}
			
			a>img{
				width: 100%;
				
			}
			.logoimg>img{
				height: 140%;
				border-radius: 50%;
			}
			
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav hbg">
			<div class="ic mui-icon-let-nav mui-pull-left logoimg" >
				<img id="headerimg" src="../img/logo.png"/>
			</div>
		    <h1 class="mui-title" id="headername">迅航云店</h1>
		    <!--
            	作者：592176224@qq.com
            	时间：2019-01-02
            	描述：
            	<div class="ic mui-icon-right-nav mui-pull-right" onclick="goadd()">交班</div>
            -->
		</header>
		<!--
        	作者：592176224@qq.com
        	时间：2019-02-28
        	描述：
        	
        	
        -->
		<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
			<div id="slider" class="mui-slider">
				    <div class="mui-slider-group mui-slider-loop">
				    <!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
					    <div class="mui-slider-item mui-slider-item-duplicate">
					      <a href="#">
					        <img src="../banner/banner-04.jpg">
					      </a>
					    </div>
				    <!-- 第一张 -->
					    <div class="mui-slider-item">
					      <a href="#">
					        <img src="../banner/banner-01.jpg">
					      </a>
					    </div>
				    <!-- 第二张 -->
					    <div class="mui-slider-item">
					      <a href="#">
					        <img src="../banner/banner-02.jpg">
					      </a>
					    </div>
				    <!-- 第三张 -->
					    <div class="mui-slider-item">
					      <a href="#">
					        <img src="../banner/banner-03.jpg">
					      </a>
					    </div>
				    <!-- 第四张 -->
					    <div class="mui-slider-item">
					      <a href="#">
					        <img src="../banner/banner-04.jpg">
					      </a>
					    </div>
				    <!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
					    <div class="mui-slider-item mui-slider-item-duplicate">
					      <a href="#">
					        <img src="../banner/banner-01.jpg">
					      </a>
					    </div>
				  	</div>
				  	<div class="mui-slider-indicator">
					    <div class="mui-indicator mui-active"></div>
					    <div class="mui-indicator"></div>
					    <div class="mui-indicator"></div>
					    <div class="mui-indicator"></div>
				  	</div>
				</div>
				<div class="show1">
					<div class="show2" id="showtow">
						<div class="sdiv">
							<div class="sdivimg"><img src="../img/time.png"/></div>
							<div class="">今日消费</div>
						</div>
						<div class="show3">
							<div class="text5 br">
								<div class="">消费（元）</div>
								<div class="">0</div>
								<div class="">0笔</div>
							</div>
							<div class="text5 br">
								<div class="">充值（元）</div>
								<div class="">0</div>
								<div class="">0笔</div>
							</div>
							<div class="text5">
								<div class="">会员（个）</div>
								<div class="">0</div>
								<div class="">累计0个</div>
							</div>
						</div>
					</div>
				</div>
			<div class="div8">
				<div class="" id="addmembers2">
					<div class="mainimg">
		    			<img src="../img/addmem.png"/>
		    		</div>
		    		<div id="">新增会员</div>
				</div>
		    	<div class="" id="cashier"><div class="mainimg">
		    	<img src="../img/cashier.png"/>
		    	</div><div id="">收银记账</div></div>
		    	
		    	<div class="" id="cancelled"><div class="mainimg">
		    	<img src="../img/cancelled.png"/>
		    	</div><div id="">挂单列表</div></div>
		    	
		    	<div class="" id="memberInformation" ><div class="mainimg">
		    	<img src="../img/inordec.png"/>
		    	</div><div id="">次卡扣减</div></div>
		    	
		    	<div class="" id="fastCharge" ><div class="mainimg">
		    	<img src="../img/topup.png"/>
		    	</div><div id="">充值管理</div></div>
		    	
		    	<div class="" id="members" ><div class="mainimg">
		    	<img src="../img/members.png"/>
		    	</div><div id="">会员管理</div></div>
		    	
		    	<div class="" id="commodity-management"><div class="mainimg">
		    	<img src="../img/shoping.png"/>
		    	</div><div id="">商品管理</div></div>
		    	
		    	<div class="" id="message" ><div class="mainimg">
		    	<img src="../img/message.png"/>
		    	</div><div id="">消息提醒</div></div>
			</div>
			
			<div class="div8 bgw">
				<div class="" id="bofp" ><div class="mainimg">
		    	<img src="../img/bofp.png"/>
		    	</div><div id="">日常收支</div></div>
		    	
		    	<div class="" id="reservation" ><div class="mainimg">
		    	<img src="../img/reservation.png"/>
		    	</div><div id="">预约管理</div></div>
		    	
		    	<div class="" id="vouchers" ><div class="mainimg">
		    	<img src="../img/vouchers.png"/>
		    	</div><div id="">发券管理</div></div>
		    	
		    	<div class="" id="forGoods" ><div class="mainimg">
		    	<img src="../img/integral.png"/>
		    	</div><div id="">积分兑换</div></div>
		    	
		    	<div class="" id="documents"><div class="mainimg">
		    	<img src="../img/documents.png"/>
		    	</div><div id="">单据管理</div></div>
		    	
		    	<div class="" id="analysis" ><div class="mainimg">
		    	<img src="../img/analysis.png"/>
		    	</div><div id="">员工分析</div></div>
		    	
		    	<div class="" id="succession"><div class="mainimg">
		    	<img src="../img/shoping.png"/>
		    	</div><div id="">员工交班</div></div>
		    </div>	
			</div>
		</div>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/mui.min.js"></script>
		<script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var page = 1;
			window.onload = function(){
				mui.init({
                        	pullRefresh : {
						    container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
						    down : {
						      height:50,//可选,默认50.触发下拉刷新拖动距离,
						      auto: false,//可选,默认false.首次加载自动下拉刷新一次
						      contentdown : "下拉可以刷新",//可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
						      contentover : "释放立即刷新",//可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
						      contentrefresh : "正在刷新...",//可选，正在刷新状态时，下拉刷新控件上显示的标题内容
						      callback :function (){
						      		console.log("下拉");
						      		getshow();
						      		mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
						      }
						    },
						  }
                });
                
                
                g("addmembers2").addEventListener("tap",function(){
                	gopage1('addmembers2');
                })
                g("cashier").addEventListener("tap",function(){
                	gomember('cashier');
                })
                g("cancelled").addEventListener("tap",function(){
                	gopage1('cancelled');
                })
                g("memberInformation").addEventListener("tap",function(){
                	gomember('memberInformation');
                })
                g("fastCharge").addEventListener("tap",function(){
                	gomember('fastCharge');
                })
                g("members").addEventListener("tap",function(){
                	gopage1('members');
                })
                g("commodity-management").addEventListener("tap",function(){
                	 gopage1('commodity-management');
                })
                g("message").addEventListener("tap",function(){
                	gopage1('message');
                })
                g("bofp").addEventListener("tap",function(){
                	gopage1('bofp');
                })
                g("reservation").addEventListener("tap",function(){
                	gopage1('reservation');
                })
                g("vouchers").addEventListener("tap",function(){
                	gopage1('vouchers');
                })
                g("forGoods").addEventListener("tap",function(){
                	gomember('forGoods');
                })
                g("documents").addEventListener("tap",function(){
                	 gopage1('documents');
                })
                g("analysis").addEventListener("tap",function(){
                	gopage1('analysis');
                })
                g("succession").addEventListener("tap",function(){
                	 gopage1('succession');
                })
                
                //获得slider插件对象
				var gallery = mui('.mui-slider');
				gallery.slider({
				  interval:60000//自动轮播周期，若为0则不自动播放，默认为0；
				});
                
                getbanner();
                getshow();
                getstore();
			}
			//获取门店信息
			function getstore(){
				var data = {
					url:"/api/store/detail",
					data:{
						access_token:acctoken(),
					}
				}
				ajax(data,function(res){
					//console.log("门店信息",res);
					g("headername").innerHTML = res.data.store_name;
					if(res.data.images&&res.data.images.path_name){
						g("headerimg").src = res.data.images.path_name;
					}
				})
				
			}
			//获取banner
			function getbanner(){
				var data = {
					url:"/api/banner/lst",
					data:{
						access_token:acctoken(),
					}
				}
				ajax(data,function(res){
					//console.log("banner",res);
					setbanner(res.data);
				})
				
			}
			
			function setbanner(list){
				if(list&&list.length > 0){
					//最后一张 假图
					var str = 	'<div class="mui-slider-group mui-slider-loop">'+
					    			'<div class="mui-slider-item mui-slider-item-duplicate">'+
					      				'<a href="#">'+
					        				'<img src="'+list[list.length-1].path_name+'">'+
					     				'</a>'+
					     			'</div>';
					list.forEach(function(item,index){
						str +=	'<div class="mui-slider-item">'+
					      			'<a href="#">'+
					        			'<img src="'+item.path_name+'">'+
					      			'</a>'+
					      		'</div>';
					})
					//第一张 假图
					str += '<div class="mui-slider-item mui-slider-item-duplicate">'+
					      		'<a href="#">'+
					        		'<img src="'+list[0].path_name+'">'+
					      		'</a>'+
					      	'</div>'+
					    '</div>';
					str +='<div class="mui-slider-indicator">';
					list.forEach(function(item,index){
						if(index == 0){
							str +=	'<div class="mui-indicator mui-active"></div>';
						}else{
							str += '<div class="mui-indicator"></div>';
						}
					})     	
					str += '</div>';
					g("slider").innerHTML = str;
					mui(".mui-slider").slider();
					var gallery = mui('.mui-slider');
	                gallery.slider({
	                    interval: 60000 //自动轮播周期，若为0则不自动播放，默认为0；
	                });
				}
				
				
			}
			
			
			function setshow(list){
                    	//console.log("三组信息",list);
                    	var str = '<div class="sdiv"><div class="sdivimg">'+
                    	'<img src="../img/time.png"/></div><div class="">今日消费</div>'+
						'</div><div class="show3"><div class="text5 br">'+
						'<div class="">消费（元）</div><div class="fe1">'+
						list[0].today_money+
						'</div>'+
						'<div class="">'+list[0].today_count+'笔</div></div>'+
						'<div class="text5 br">'+
							'<div class="">充值（元）</div>'+
							'<div class="fe1">'+list[1].today_money+'</div>'+
							'<div class="">'+list[1].today_count+'笔</div>'+
						'</div><div class="text5">'+
							'<div class="">会员（个）</div>'+
							'<div class="fe1">'+list[2].today_count+'</div>'+
							'<div class="">累计'+list[2].all_count+'个</div>'+
						'</div></div>';
                    	g("showtow").innerHTML = str;
            }
			function getshow(){
                    	var rlist = [];
                    	var data = {
                    		url:"/api/order/today_gather",
                    		data:{
                    			access_token:acctoken()
                    		}
                    	}
                    	ajax(data,function(res){
                    		//console.log(res);
                    		rlist.push(res.data);
                    		var data2 = {
                    			url:"/api/recharge/today_gather",
	                    		data:{
	                    			access_token:acctoken()
	                    		}
                    		}
                    		ajax(data2,function(res2){
                    			//console.log(res2)
                    			rlist.push(res2.data);
                    			var data3 = {
                    				url:"/api/member/gather",
                    				data:{
                    					access_token:acctoken()
                    				}
                    			}
                    			ajax(data3,function(res3){
                    				//console.log(res3);
                    				rlist.push(res3.data);
                    				setshow(rlist);
                    				
                    			})
                    		})
                    	})
            }
			
			function gopage1(url){
				console.log("跳转",url);
				mui.openWindow({
				    url: url +'.html', 
				    id: url
				 });
			}
			function gointegral(){
				mui.openWindow({
				    url: 'integral/integral.html', 
				    id: 'integral',
				});
			}
			function gomember(type,id){
				//查找会员带入参数
				var list = {gotype:type}
				mui.openWindow({
				    url: '../general/lookingForMember.html?gotype='+type, 
				    id: 'lookingForMember',
				    extras:list,
				});
			}	
			
			
		</script>
	</body>

</html>